import QtQuick 2.15
import QtQuick.Controls 2.15

Item {
    id: control
    property string text: "text"
    property bool highlights : false
    width: 88
    height: 36
    FontLoader{
        id: boldFont
        source:"fonts/SourceHanSansCN-Bold.otf"
    }
    Image {
        id: image
        anchors.fill: parent
        source: "images/action-normal.png"
        fillMode: Image.Stretch

        Text {
            id: text1
            color: "#cedce6"
            text: control.text
            anchors.fill: parent
            font.pixelSize: 14
            font.family: boldFont.name
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter
        }
    }
    states:[
        State{
            name: "highlights"
            when: control.highlights
            PropertyChanges {
                image{
                    source: "images/action-hovered.png"
                }
                text1{
                    color: "#ffffff"
                }
            }
        },
        State{
            name: "normal"
            when: !control.highlights
            PropertyChanges {
                image{
                    source: "images/action-normal.png"
                }
                text1{
                    color: "#cedce6"
                }
            }
        }
    ]
}
